<template>
	<view>
		<u-navbar :title="title" bgColor="transparent" :titleStyle="{fontSize:'36rpx',fontWeight:'500'}">
			<view slot="left"></view>
		</u-navbar>
		<u-tabbar :value="tabVal" @change="changeTabBar" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
			:border="false">
			<u-tabbar-item text="首页" name="index/index">
				<image class="u-page__item__slot-icon" slot="active-icon" src="/static/home_act.png"></image>
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="/static/home.png"></image>
			</u-tabbar-item>
			<u-tabbar-item name="recycle/recycle">
				<image class="u-page__item__slot-icon centerItem" slot="active-icon" src="/static/recycle.png"></image>
				<image class="u-page__item__slot-icon centerItem" slot="inactive-icon" src="/static/recycle.png">
				</image>
			</u-tabbar-item>
			<u-tabbar-item text="我的" name="mine/mine">
				<image class="u-page__item__slot-icon" slot="active-icon" src="/static/mine_act.png"></image>
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="/static/mine.png"></image>
			</u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		props: {
			title: {
				type: String,
				default: "盘达派"
			},
			tabVal: {
				type: String,
				default: "index/index"
			}
		},
		data() {
			return {};
		},
		methods: {
			changeTabBar(name) {
				uni.switchTab({
					url: "/pages/" + name
				})
			},
			leftClick() {
				let a = getCurrentPages();
			}
		}
	}
</script>

<style lang="scss">
	.u-page__item__slot-icon {
		width: 48rpx;
		height: 48rpx;
	}

	.centerItem {
		width: 96rpx;
		height: 96rpx;
	}
</style>
